<template>
    <div class="payResult flexv">
        <!-- 头部 -->
        <pubHead :title="msg" ></pubHead>

        <!-- 支付结果 -->
        <div class="flexv result">
            <img src="@/assets/success_ico.png" v-if="type == 1" alt="">
            <img src="@/assets/fail_ico.png" v-else alt="">
            <p class="note tc" v-if="type == 1">支付成功</p>
            <p class="note tc" v-else>支付失败</p>

            <div class="btns jus-b">
                <div class="btn tc" @click="toIndex">返回首页</div>
                <div class="btn tc continue" @click="toNext">继续逛逛</div>
            </div>
        </div>


    </div>
</template>
<script>
import Vue from 'vue';
import pubHead from '@/components/head';
import { Toast, Dialog } from 'vant';
import {  } from '@/request/api';

Vue.use(Toast )
export default {
    data(){
        return{
            msg: '支付成功',
            type: 1, // 支付结果 1成功 2失败
            order_id: '', // 订单id
        }
    },
    components: {
        pubHead,
    },
    created(){
        if(this.$route.query.type){
            this.type = this.$route.query.type
        }
    },
    methods: {
        // 返回首页
        toIndex(){
            this.$router.replace('/')
        },
        // 返回首页
        toNext(){
            this.$router.replace('/classify')
        },
    },
}
</script>
<style lang="less" scoped>
.payResult{
    min-height: 100vh;
    padding: 0 0.3rem;
    background-color: #fff;
    .result{
        margin-top: 2.4rem;
        img{
            width: 1.5rem;
            height: 1.5rem;
            margin: 0 auto;
            border-radius: 100%;
        }
        p{
            margin-top: 0.4rem;
            font-size: 0.34rem;
            line-height: 120%;
            color: #333;
        }
        .btns{
            width: 5.62rem;
            margin: 0.9rem auto 0;
            .btn{
                width: 2.18rem;
                height: 0.76rem;
                font-size: 0.3rem;
                line-height: 0.74rem;
                color: #333;
                border-radius: 0.38rem;
                border: 0.01rem solid #666;
            }
            .continue{
                border-color: #EC282E;
                color: #EC282E;
            }
        }
    }
}
</style>